import 'package:flutter/material.dart';
import 'package:flutter_09_game/base/widget/base_get_builder.dart';
import 'package:flutter_09_game/config/app_color.dart';
import 'package:flutter_09_game/generated/assets.dart';
import 'package:flutter_09_game/generated/locales.g.dart';
import 'package:flutter_09_game/user/app_user_manager.dart';
import 'package:flutter_09_game/utils/log/utils_log.dart';
import 'package:flutter_09_game/widgets/appbar/common_app_bar.dart';
import 'package:flutter_09_game/widgets/btn_dropdown.dart';
import 'package:flutter_09_game/widgets/button/common_button.dart';
import 'package:flutter_09_game/widgets/image/auto_image.dart';
import 'package:flutter_09_game/widgets/input/common_text_field.dart';
import 'package:flutter_09_game/widgets/verify_input_box/src/verification_box.dart';
import 'package:flutter_09_game/widgets/widget_profile_item.dart';
import 'package:flutter_09_game/widgets/widget_verification_box.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import 'profile_set_password_logic.dart';

class ProfileSetPasswordPage extends StatelessWidget {
  ProfileSetPasswordPage({super.key});

  final ProfileSetPasswordLogic logic = Get.put(ProfileSetPasswordLogic());

  @override
  Widget build(BuildContext context) {
    return BaseGetBuilder<ProfileSetPasswordLogic>(
      appBar: CommonAppBar(
        title: LocaleKeys.setFundPassword.tr,
        actions: [
          GestureDetector(
            onTap: () {
              AppUserManager().showServiceSheet();
            },
            child: AutoImage(
              Assets.commonServiceBtn,
              width: 32.w,
            ),
          ),
          10.horizontalSpace,
        ],
      ),
      builder: (L) {
        return Container(
          padding: EdgeInsets.all(12.w),
          margin: EdgeInsets.all(16.w)
              .copyWith(bottom: 16 + ScreenUtil().bottomBarHeight),
          decoration: BoxDecoration(
              color: AppColor.navBgColor,
              borderRadius: BorderRadius.circular(16.w)),
          child: Column(
            children: [
              Expanded(
                  child: SingleChildScrollView(
                child: Column(
                  children: [
                    Obx(() {
                      return WidgetProfileItem(
                          LocaleKeys.newSecurityQuestion.tr,
                          _buildTopDropdown(
                              logic.questionItems
                                  .map((item) => item.Content ?? '')
                                  .toList(),
                              value: logic.questionRx.value, onChanged: (value) {
                            logic.questionRx.value = value;
                          }));
                    }),
                    16.verticalSpaceFromWidth,
                    WidgetProfileItem(
                        LocaleKeys.securityAnswer.tr,
                        CommonTextField(
                          textEditingController: logic.answerController,
                          hintText: LocaleKeys.enterSecurityAnswer.tr,
                          backgroundColor: Colors.black.withOpacity(0.3),
                          borderColor: AppColor.textPrimary.withOpacity(0.15),
                        )),
                    16.verticalSpaceFromWidth,
                    WidgetProfileItem(
                        LocaleKeys.securityAnswerHint.tr,
                        CommonTextField(
                          textEditingController: logic.tipsController,
                          hintText: LocaleKeys.enterSecurityHint.tr,
                          backgroundColor: Colors.black.withOpacity(0.3),
                          borderColor: AppColor.textPrimary.withOpacity(0.15),
                        )),
                    16.verticalSpaceFromWidth,
                    WidgetProfileItem(LocaleKeys.fundPassword.tr,
                        WidgetVerificationBox(
                      onValueChanged: (text) {
                        logic.fundPassword.value = text;
                      },
                    )),
                    16.verticalSpaceFromWidth,
                    WidgetProfileItem(LocaleKeys.confirmFundPassword.tr,
                        WidgetVerificationBox(
                      onValueChanged: (text) {
                        clog('valdjkv  $text');
                        logic.confirmPassword.value = text;
                      },
                    )),
                  ],
                ),
              )),
              12.verticalSpaceFromWidth,
              Obx(() => CommonButton.expend(
                    title: LocaleKeys.confirmSet.tr,
                    enable: logic.isFormValid.value,
                    onClick: () {
                      logic.setFundPassword();
                    },
                  )),
            ],
          ),
        );
      },
    );
  }

  Widget _buildTopDropdown(List<String> items,
      {required String value,
      required Function(String) onChanged,
      Color? btnColor}) {
    return BtnDropdown(
        items: items,
        value: value,
        // width: 1.sw - 32.w,
        // mainAxisAlignment: MainAxisAlignment.start,
        onChanged: (value) {
          onChanged.call(value);
        },
        child: Container(
          padding: EdgeInsets.symmetric(horizontal: 14.w, vertical: 16.w),
          decoration: BoxDecoration(
              border: Border.all(
                  color: AppColor.textPrimary.withOpacity(0.15), width: 1),
              color: Colors.black.withOpacity(0.3),
              borderRadius: BorderRadius.circular(12.w)),
          child: Row(
            children: [
              Expanded(
                  child: Text(
                value,
                style: TextStyle(
                  fontSize: 14.sp,
                  fontWeight: FontWeight.w500,
                  color: btnColor ?? AppColor.textPrimary.withOpacity(0.94),
                ),
              )),
              AutoImage(
                Assets.commonDownArrow,
                width: 16.w,
              )
            ],
          ),
        ));
  }
}
